<template>
  <div class="flex-row auto"  style="margin-top:10px;width:96%" >
    <form class="form-horizontal" style="flex: 1;">
      <div class="form-group auto">
        <label for="commode"   class="col-sm-2 control-label">通信模式:</label>
         <div class="col-sm-2"   >
           <v-select :value.sync="model.settings.commode" :options='commodetype' placeholder='通信模式' close-on-select>
           </v-select>
         </div>
         <label for="ydtime"   class="col-sm-2 control-label">约定通信时间:</label>
         <div class="col-sm-2" >
           <datepicker
             width="100%"
             placeholder="约定通信时间"
             v-model="model.settings.ydtime"
             :value.sync="model.settings.ydtime"
             :disabled-days-of-Week="[]"
             :format="'ddHHmmss'"
             :show-reset-button="reset">
           </datepicker>
         </div>
         <label for="ssinterval"   class="col-sm-2 control-label">实时通信间隔:</label>
         <div class="col-sm-2"   >
           <input type="text" class="form-control" v-model="model.settings.ssinterval">
         </div>
       </div>

       <div class="form-group auto" style="margin-top:10px;">
         <label for="retrytimes"   class="col-sm-2 control-label">最大重试次数:</label>
           <div class="col-sm-2" >
             <input type="text" class="form-control" v-model="model.settings.retrytimes" >
           </div>
           <label for="retrysec"   class="col-sm-2 control-label">重试时间间隔:</label>
           <div class="col-sm-2" >
             <input type="text" class="form-control" v-model="model.settings.retrysec"  >
           </div>
           <label for="disconnectsec"   class="col-sm-2 control-label">无命令挂断时间:</label>
           <div class="col-sm-2">
             <input type="text" class="form-control" v-model="model.settings.disconnectsec"  >
           </div>
       </div>
       <div class="form-group auto" style="margin-top:10px;">
         <label for="dstime1"   class="col-sm-2 control-label">定时通信时间 1:</label>
           <div class="col-sm-2"  >
             <datepicker id="dstime1"
               v-model="model.settings.dstime1"
               :value.sync="model.settings.dstime1"
               :disabled-days-of-Week="[]"
               :format="'MMddHHmm'"
               :show-reset-button="reset">
             </datepicker>.
           </div>
           <label for="dstime2"   class="col-sm-2 control-label">定时通信时间 2:</label>
           <div class="col-sm-2" >
             <datepicker
               width="100%"
               v-model="model.settings.dstime2"
               :value.sync="model.settings.dstime2"
                :disabled-days-of-Week="[]"
               :format="'MMddHHmm'"
               :show-reset-button="reset">
             </datepicker>
           </div>
           <label for="dstime3"   class="col-sm-2 control-label">定时通信时间 3:</label>
           <div class="col-sm-2" >
             <datepicker
             width="100%"
               v-model="model.settings.dstime3"
               :value.sync="model.settings.dstime3"
               :disabled-days-of-Week="[]"
               :format="'MMddHHmm'"
               :show-reset-button="reset">
             </datepicker>
           </div>
       </div>
    </form>
  </div>
</template>

<script>
export default {
  data () {
    return {
      Settingmodel: {},
      model: {
        meterno: '',
        settingtype: 2,
        settings: {
          commode: [],
          dstime1: '',
          dstime2: '',
          dstime3: '',
          ydtime: ''
        }
      }
    }
  },
  props: ['data'],
  ready () {
    if (this.data) {
      this.model.meterno = this.data.f_meternumber
      this.getparam(this.data.f_user_id)
    }
  },
  watch: {
    'data' (val) {
      if (val) {
        this.model.meterno = val.f_meternumber
        this.getparam(val.f_user_id)
      }
    }
  },
  methods: {
    getparam (f_user_id) {
      let tablename = 't_wmnetsetting'
      let condition = 'f_user_id=' + "'" + f_user_id + "'"
      this.$SqlService.singleTable(tablename, condition)
      .then(
        (res) => {
          if (res.data.length === 1) {
            this.model.settings = this.reciveparams(res.data[0])
            this.model.settings.commode[0] = res.data[0].f_commode
            this.Settingmodel.id = res.data[0].id
          }
        }
      ).catch(
        (error) => this.$dispatch('error', '运行参数设置', this.data, error)
      )
    },
    converseparam () {
      this.model.settings.commode = this.model.settings.commode[0]
      this.Settingmodel = Object.assign({}, this.Settingmodel, this.getSettingmodel())
    },
    getSettingmodel () {
      return {
        f_commode: this.model.settings.commode[0],
        f_ssinterval: this.model.settings.ssinterval,
        f_ydtime: this.model.settings.ydtime,
        f_retrytimes: this.model.settings.retrytimes,
        f_retrysec: this.model.settings.retrysec,
        f_disconnectsec: this.model.settings.disconnectsec,
        f_dstime1: this.model.settings.dstime1,
        f_dstime2: this.model.settings.dstime2,
        f_dstime3: this.model.settings.dstime3
      }
    },
    reciveparams (val) {
      return {
        commode: [],
        ssinterval: val.f_ssinterval,
        ydtime: val.f_ydtime,
        retrytimes: val.f_retrytimes,
        retrysec: val.f_retrysec,
        disconnectsec: val.f_disconnectsec,
        dstime1: val.f_dstime1,
        dstime2: val.f_dstime2,
        dstime3: val.f_dstime3
      }
    }
  },
  computed: {
    commodetype () {
      return [{label: '实时模式', value: '1'},
          {label: '约定模式', value: '2'},
          {label: '实时+约定', value: '3'},
          {label: '定时模式', value: '4'},
          {label: '定时+约定', value: '6'},
          {label: '关闭', value: '255'}]
    }
  }
}
</script>
